<ui:composition xmlns="http://www.w3.org/1999/xhtml"
                xmlns:ui="http://java.sun.com/jsf/facelets"
                xmlns:h="http://java.sun.com/jsf/html"
                xmlns:f="http://java.sun.com/jsf/core"
                xmlns:p="http://primefaces.org/ui"
                template="../templates/principal.xhtml">

    <ui:define name="head">
        <script type="text/javascript">
            function handleModuloRequest(xhr, status, args) {
                if(!args.loggedIn) {
                    PF('usuarioDialog').show();
                } else {
                    PF('usuarioDialog').hide();
                }
            }
        </script>
    </ui:define>
    <ui:define name="content" id="content">
        <h1 class="title ui-widget-header ui-corner-all">Bem Vindo ao Cadastro de Usuários</h1>

        <h:form id="frmUsuario">
            
            <p:panel id="panel">
                <p:growl id="messages" life="5000" />

                <p:dataTable id="tabUsuario" widgetVar="wtabUsuario" var="usuario" value="#{usuarioBean.lazyModel}" paginator="true" rows="12" lazy="true"
                             emptyMessage="Nenhum Registro Retornado ..." filterEvent="enter">

                    <f:facet name="header">
                        Selecione uma linha e clique para Manutenção
                    </f:facet>

                    <p:column headerText="Nome" sortBy="#{usuario.nomUsuario}" filterBy="#{usuario.nomUsuario}">
                        <h:outputText value="#{usuario.nomUsuario}" />
                    </p:column>

                    <p:column headerText="E-Mail" sortBy="#{usuario.dscEmail}" filterBy="#{usuario.dscEmail}">
                        <h:outputText value="#{usuario.dscEmail}" />
                    </p:column>

                    <p:column headerText="Status" sortBy="#{usuario.tipStatus}" filterBy="#{usuario.tipStatus}">
                        <h:outputText value="#{usuario.tipStatus}" />
                    </p:column>

                    <p:column headerText="Tipo" sortBy="#{usuario.tipUsuario}" filterBy="#{usuario.tipUsuario}">
                        <h:outputText value="#{usuario.tipUsuario}" />
                    </p:column>

                    <p:column style="width: 100px;">
                        <p:panelGrid columns="4" styleClass="actions">
                            <p:commandButton id="selectButtonUsuario" update=":frmUsuario:panel :frmUsuario:messages" 
                                             icon="ui-icon-search" title="Visualizar // Alterar" oncomplete="PF('usuarioDialog').show()" process="@all">
                                <f:setPropertyActionListener value="#{usuario}" target="#{usuarioBean.selectedUsuario}" />
                                <f:setPropertyActionListener value="#{false}" target="#{usuarioBean.disable1}" />
                                <f:setPropertyActionListener value="#{true}" target="#{usuarioBean.disable2}" />
                            </p:commandButton>

                            <p:commandButton id="excluirButtonUsuario" update=":frmUsuario:confirmaExclusao :frmUsuario:messages" 
                                             icon="ui-icon-trash" title="Excluir Usuário" oncomplete="PF('confirmation').show()">
                                <f:setPropertyActionListener value="#{usuario}" target="#{usuarioBean.selectedUsuario}" />
                            </p:commandButton>
                        </p:panelGrid>
                    </p:column>

                    <f:facet name="footer">
                        <div style="text-align: left;">
                            <p:commandButton id="incluirButtonUsuario" actionListener="#{usuarioBean.preparaInserir}" value="Novo Usuário"
                                             update=":frmUsuario:panel :frmUsuario:messages" process="@all"
                                             icon="ui-icon-pencil" title="Cadastrar Novo Usuário" oncomplete="PF('usuarioDialog').show()" />
                        </div>
                    </f:facet>
                </p:dataTable>

                <p:dialog id="usuarioDialog" header="Detalhes Usuario" widgetVar="usuarioDialog" resizable="true"
                          width="800" showEffect="explode" hideEffect="explode" position="top">
                    <p:outputPanel id="outUsuario">
                        <h:panelGrid id="display" columns="2" style="margin-bottom:50px" cellpadding="5">
                            <h:outputText value="Nome:" />
                            <p:inputText id="nome" value="#{usuarioBean.selectedUsuario.nomUsuario}" style="width:500px; font-weight:bold;" />

                            <h:outputText value="E-Mail:" />
                            <p:inputText id="email" value="#{usuarioBean.selectedUsuario.dscEmail}" style="width:500px; font-weight:bold;" />

                            <h:outputText value="Tipo de Usuário:" />
                            <h:selectOneMenu id="soTipoUsuario" value="#{usuarioBean.selectedUsuario.tipUsuario}">
                                <f:selectItem itemLabel="Administrador" itemValue="Administrador" />
                                <f:selectItem itemLabel="Usuário Normal" itemValue="Usuário Normal" />
                            </h:selectOneMenu>

                            <h:outputText value="Status do Usuário:" />
                            <h:selectOneMenu id="soStatusUsuario" value="#{usuarioBean.selectedUsuario.tipStatus}">
                                <f:selectItem itemLabel="Ativo" itemValue="Ativo" />
                                <f:selectItem itemLabel="Desativado" itemValue="Desativado" />
                            </h:selectOneMenu>
                            
                            <h:outputText value="Finaliza Processo:" />
                            <h:selectOneMenu id="soFinaliza" value="#{usuarioBean.selectedUsuario.finaliza}">
                                <f:selectItem itemLabel="Sim" itemValue="true" />
                                <f:selectItem itemLabel="Não" itemValue="false" />
                            </h:selectOneMenu>

                            <h:outputText value="Login:" />
                            <p:inputText id="username" value="#{usuarioBean.selectedUsuario.usrName}" style="width:250px; font-weight:bold;" />

                            <h:outputText value="Senha:" />
                            <p:password id="password1" value="#{usuarioBean.password1}" style="width:250px; font-weight:bold;" feedback="false" />

                            <h:outputText value="Confirme a Senha:" />
                            <p:password id="password2" value="#{usuarioBean.password2}" style="width:250px; font-weight:bold;" feedback="false" />
                            <f:facet name="footer">
                                <p:fieldset id="fieldModulo" legend="Modulos" toggleable="true" toggleSpeed="500" style="font-weight:bold;" collapsed="true">
                                    <p:dataTable id="modulosTable" var="modulo" value="#{usuarioBean.listModulo}" paginator="true" rows="10"
                                                 selection="#{usuarioBean.selectedModulos}" rowKey="#{modulo.idModulo}"> 

                                        <p:column selectionMode="multiple" style="width:18px" />

                                        <p:column headerText="Descrição dos Modulos">
                                            #{modulo.dscModulo}
                                        </p:column>
                                    </p:dataTable>
                                </p:fieldset>
                            </f:facet>
                        </h:panelGrid>
                        <p:commandButton id="btInserir" value="Inserir" actionListener="#{usuarioBean.inserir}" 
                                         oncomplete="handleModuloRequest(xhr, status, args)" rendered="#{usuarioBean.disable1}" />
                        <p:commandButton id="btAlterar" value="Alterar" actionListener="#{usuarioBean.alterar}" 
                                         oncomplete="handleModuloRequest(xhr, status, args)" rendered="#{usuarioBean.disable2}" />
                    </p:outputPanel>
                </p:dialog>

                <p:dialog id="confirmaExclusao" header="Confirma a Exclusão desse Usuario?" widgetVar="confirmation">

                    <p:commandButton value="Sim" update=":frmUsuario:panel :frmUsuario:messages" oncomplete="PF('confirmation').hide(), PF('usuarioDialog').hide()"
                                     actionListener="#{usuarioBean.excluir}" />
                    <p:commandButton value="Não" onclick="PF('confirmation').hide()" type="button" />

                </p:dialog>
            </p:panel>
        </h:form>
    </ui:define>
</ui:composition>